<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title>订单服务</title>
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport"
        content="width=device-width, initial-scale=1,maximum-scale=1.0, user-scalable=0,user-scalable=no">
  <meta name="format-detection" content="telephone=no">
  <meta name="renderer" content="webkit">
  <meta http-equiv="Cache-Control" content="no-siteapp"/>
  
  <link rel="alternate icon" type="img/HENGWANG.png" href="img/HENGWANG.png">
  <link rel="stylesheet" href="css/amazeui.css"/>
  <link rel="stylesheet" href="css/style.css"/>
</head>
<body>
<header class="am-topbar header">
	<div class="am-container-1">
		<div class="left hw-logo">
		  <!--<img class=" logo" src="img/HENGWANG.png"></img>-->
		  <img class="word" src="img/hw-word.png"></img>
    </div>
  <button class="am-topbar-btn am-topbar-toggle am-btn am-btn-sm am-btn-success am-show-sm-only"
          data-am-collapse="{target: '#doc-topbar-collapse'}"><span class="am-sr-only">导航切换</span> <span
      class="am-icon-bars"></span></button>

  <div class="am-collapse am-topbar-collapse right" id="doc-topbar-collapse">
    

    <div class=" am-topbar-left am-form-inline am-topbar-right" role="search">
      <ul class="am-nav am-nav-pills am-topbar-nav hw-menu">
      <li><a href="index.html">首页</a></li>
      <li><a href="solutions.html">个人中心</a></li>
      <li  class="hw-menu-active"><a href="product-show.html">订单服务 </a></li>
      <li><a href="customer-case.html">套餐服务</a></li>
      <li><a href="service-center.html">服务中心 </a></li>
      <li><a href="news.html">魔发学院 </a></li>
      <li><a href="about-us.html">关于我们</a></li>
      <li><a href="recruit.html">招贤纳士 </a></li>
    </ul>
    </div>

  </div>
  </div>
</header>
<div class="toppic">
	 <div class="am-container-1">
	 <div class="toppic-title left">
			<i class="am-icon-dropbox toppic-title-i"></i>
			<span class="toppic-title-span">订单服务</span>
			<p>Product Show</p>
		</div>
		<div class="right toppic-progress">
			<span><a href="index.html" class="w-white">首页</a></span>
			<i class=" am-icon-arrow-circle-right w-white"></i>
			<span><a href="product-show.html" class="w-white">订单服务</a></span>
		</div>
	</div>
</div>

<div >
	<ul class=" product-show-ul">
	    <li >
	    	<div class="product-content" style="height: 300px" align="center">
				<img src="img/orderp.png" alt="orderstate">
				<h3 align="left" style="padding-left: 280px">套餐类型：爆款套餐</h3>
				<table class="am-table am-table-bordered am-table-radius am-table-striped" style="width: 60%">
					<thead>
					<tr>
						<th>套餐内容</th>
						<th>预约时间</th>
						<th>发型师</th>
						<th>价格</th>
					</tr>
					</thead>
					<tbody>
					<tr>
						<td>欧莱雅染发烫发/直发一条龙套餐</td>
						<td>2018年12月28日 16：00 - 18 ：00</td>
						<td>Tony</td>
						<td>￥699</td>
					</tr>


					</tbody>
				</table>
				<a href="#" data-am-modal="{target: '#my-popup'}"><img src="img/querenzhifu.png" alt="querenzhifu"></a>
	    	</div>

			<div class="am-popup" id="my-popup">
				<div class="am-popup-inner">
					<div class="am-popup-hd">
						<h4 class="am-popup-title">请您扫码支付</h4>
						<span data-am-modal-close
							  class="am-close">&times;</span>
					</div>
					<div class="am-popup-bd">
						<img src="img/erweima.png" alt="" style="width: 500px;height: 500px;">

					</div>
				</div>
			</div>
	    </li>
	    <li >
	    	<div class="product-content">

				<div class="clear"></div>
	    	</div>
	    </li>
	    <div class="clear"></div>
	</ul>
</div>

  
   
		
</div>


<footer class="footer ">

	<ul>

		<li class="am-u-lg-4 am-u-md-4 am-u-sm-12 part-5-li2">
			<div class="part-5-title">联系我们</div>
			<div class="part-5-words2">
				<span>Copyright ©2018 专业综合设计</span>
				<span>店家联系电话：xxxxx</span>
				<span>author by Mr.huang</span>
				<span>邮箱:support@siheng.site</span>
				<span><i class="am-icon-phone"></i><em >027-520520</em></span>
			</div>
		</li>
		<li class="am-u-lg-4 am-u-md-4 am-u-sm-12 ">
			<div class="part-5-title">相关链接</div>
			<div class="part-5-words2">
				<ul class="part-5-words2-ul">
					<li class="am-u-lg-4 am-u-md-6 am-u-sm-4"><a href="solutions.html">个人中心</a></li>
					<li class="am-u-lg-4 am-u-md-6 am-u-sm-4"><a href="product-show.html">订单服务</a></li>
					<li class="am-u-lg-4 am-u-md-6 am-u-sm-4"><a href="customer-case.html">套餐服务</a></li>
					<li class="am-u-lg-4 am-u-md-6 am-u-sm-4"><a href="service-center.html">服务中心</a></li>
					<li class="am-u-lg-4 am-u-md-6 am-u-sm-4"><a href="about-us.html">关于我们</a></li>
					<li class="am-u-lg-4 am-u-md-6 am-u-sm-4"><a href="recruit.html">招贤纳士</a></li>
					<div class="clear"></div>
				</ul>
			</div>
		</li>
		<div class="clear"></div>
	</ul>

</footer>

</body>
<!--[if lt IE 9]>
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>
<script src="assets/js/amazeui.ie8polyfill.min.js"></script>
<![endif]-->

<!--[if (gte IE 9)|!(IE)]><!-->
<script src="js/jquery.min.js"></script>
<!--<![endif]-->
<script src="js/amazeui.min.js"></script>
<script>
    $(".am-close").click(function () {
		// $("img[alt='orderstate']").attr("src","img/orderdengdai.png");
		// $("img[alt='querenzhifu']").attr("src","img/dengdaifuwu.png");
        // $("img[alt='querenzhifu']").parentElement.attr("data-am-modal","");
        setTimeout(
            $("img[alt='orderstate']").attr("src","img/orderdengdai.png"),
            $("img[alt='querenzhifu']").attr("src","img/dengdaifuwu.png"),
            $("img[alt='querenzhifu']").parentElement.attr("data-am-modal",""),15000);
    });

</script>
</html>
